{extend name="common/base" /}
{block name="content"}
<div id="LAY_app">
    <div class="layui-layout layui-layout-admin">
        <div class="layui-header">
            <!-- 头部区域 -->
            <ul class="layui-nav layui-layout-left">
                <li class="layui-nav-item layadmin-flexible" lay-unselect>
                    <a href="javascript:" layadmin-event="flexible" title="侧边伸缩">
                        <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect>
                    <a href="javascript:" layadmin-event="refresh" title="刷新">
                        <i class="layui-icon layui-icon-refresh-3"></i>
                    </a>
                </li>
            </ul>
            <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">


                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:" layadmin-event="fullscreen">
                        <i class="layui-icon layui-icon-screen-full"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect>
                    <a href="javascript:">
                        <cite>{$user.name}</cite>
                    </a>
                    <dl class="layui-nav-child">
                        <dd><a lay-href="/admin/user/{$user.id}">基本资料</a></dd>
                        <dd><a href="javascript:" id="edit_password">修改密码</a></dd>
                        <hr>
                        <dd id="logout" style="text-align: center;cursor: pointer"><a>退出</a></dd>
                    </dl>
                </li>

                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:" layadmin-event="about"><i class="layui-icon layui-icon-more-vertical"></i></a>
                </li>
            </ul>
        </div>

        <!-- 侧边菜单 -->
        <div class="layui-side layui-side-menu">
            <div class="layui-side-scroll">
                <div class="layui-logo" lay-href="/admin/welcome">
                    <span>WebSystem</span>
                    <i class="iconfont none">WS</i>
                </div>

                <ul class="layui-nav layui-nav-tree" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
                    {include file="index/nav" /}
                </ul>
            </div>
        </div>

        <!-- 页面标签 -->
        <div class="layadmin-pagetabs" id="LAY_app_tabs">
            <div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
            <div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
            <div class="layui-icon layadmin-tabs-control layui-icon-down">
                <ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
                    <li class="layui-nav-item" lay-unselect>
                        <a href="javascript:"></a>
                        <dl class="layui-nav-child layui-anim-fadein">
                            <dd layadmin-event="closeThisTabs"><a href="javascript:">关闭当前标签页</a></dd>
                            <dd layadmin-event="closeOtherTabs"><a href="javascript:">关闭其它标签页</a></dd>
                            <dd layadmin-event="closeAllTabs"><a href="javascript:">关闭全部标签页</a></dd>
                        </dl>
                    </li>
                </ul>
            </div>
            <div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
                <ul class="layui-tab-title" id="LAY_app_tabsheader">
                    <li lay-id="/admin/welcome" lay-attr="/admin/welcome" class="layui-this"><i class="layui-icon layui-icon-home"></i></li>
                </ul>
            </div>
        </div>


        <!-- 主体内容 -->
        <div class="layui-body" id="LAY_app_body">
            <div class="layadmin-tabsbody-item layui-show">
                <iframe src="/admin/welcome" frameborder="0" class="layadmin-iframe"></iframe>
            </div>
        </div>

        <!-- 辅助元素，一般用于移动设备下遮罩 -->
        <div class="layadmin-body-shade" layadmin-event="shade"></div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    layui.config({
        base: '<?php echo SITE;?>static/layuiadmin/'
    }).extend({
        index: 'lib/index'
    }).use('index',async () => {
        const { layer, admin, $,element,form } = layui;
        $('body').addClass('layui-layout-body');


        $('#logout').on('click',async function (){
            let res = await admin.post('/admin/login/logout',{});
            if(res.status){
                setTimeout(
                    function () {
                        self.location = '/admin/login/index';
                    },1500
                );
            }
        });

        $('#edit_password').on('click',function (){
            clean_data();
            layer.open({
                type: 1
                , title: '编辑'
                , area: ['400px']
                , maxmin: true
                , shade: 0.6
                , content: $('#create_op')
            });
        });
        /*清理数据*/
        function clean_data(){
            form.val('op_form', {
                "password":  '',
                "re_password": '',
                "old_password":  '',
            });
        }

        /*监听提交*/
        form.on('submit(save_sub)', function(data){
            data =data.field;
            let type = 'POST';
            let url = '/admin/user/update_password';

            if(data.password !== data.re_password){
                layer.msg('两次密码不一样');
                return false;
            }

            $.ajax({
                type: type,
                url: url,
                data: data,
                datatype: 'json',
                success: function (res) {
                    if (res.status) {
                        layer.closeAll();
                    }
                    layer.msg(res.msg);
                }
            });
            return false;
        });


        /*实时信息*/
        // let ws = new WebSocket('ws://148.70.20.76:1234');
        // ws.onopen = function(){
        //     let uid = '{$user.id}';
        //     ws.send(uid);
        // };
        // ws.onmessage = function(e){
        //     //alert(e.data);
        //     console.log(e.data);
        //     //window.location.reload();
        // };
        // ws.onerror = function (e){
        //     layer.msg('客服不在线');
        // }
        /*实时信息*/

    });
</script>
{/block}

{block name="template"}
<div id="create_op" class="none">
    <div class="op_body">
        <form class="layui-form layui-form-pane" action="" lay-filter="op_form">

            <div class="layui-form-item">
                <label class="layui-form-label">当前密码</label>
                <div class="layui-input-block">
                    <input type="password" name="old_password" id="old_password" autocomplete="off" placeholder="当前密码" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">新密码</label>
                <div class="layui-input-block">
                    <input type="password" name="password" id="password" autocomplete="off" placeholder="新密码" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">重复新密码</label>
                <div class="layui-input-block">
                    <input type="password" name="re_password" id="re_password" autocomplete="off" placeholder="重复新密码" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit="" lay-filter="save_sub">修改</button>
                </div>
            </div>
        </form>
    </div>
</div>
{/block}

